package com.anthonybennis.blender.client.pages.tipofday;

import com.anthonybennis.blender.client.Navigatgor;
import com.anthonybennis.blender.client.Navigatgor.PAGE;
import com.anthonybennis.blender.client.System;
import com.anthonybennis.blender.client.System.SCREEN_WIDTHS;
import com.anthonybennis.blender.client.Util;
import com.google.gwt.dom.client.Style.Unit;
import com.google.gwt.event.dom.client.ClickEvent;
import com.google.gwt.event.dom.client.ClickHandler;
import com.google.gwt.event.dom.client.TouchStartEvent;
import com.google.gwt.event.dom.client.TouchStartHandler;
import com.google.gwt.user.client.Window;
import com.google.gwt.user.client.ui.CellPanel;
import com.google.gwt.user.client.ui.DockLayoutPanel;
import com.google.gwt.user.client.ui.HTML;
import com.google.gwt.user.client.ui.HasHorizontalAlignment;
import com.google.gwt.user.client.ui.HorizontalPanel;
import com.google.gwt.user.client.ui.Image;
import com.google.gwt.user.client.ui.Label;
import com.google.gwt.user.client.ui.PushButton;
import com.google.gwt.user.client.ui.VerticalPanel;
import com.google.gwt.user.client.ui.Widget;

/**
 * 
 * @author abennis
 */
public class Tip 
{
	private static final int DESCRIPTION_LABEL_WIDTH = 300;
	private static final int TIP_HEIGHT = 500;
	private static final int TIP_WIDTH = 700;
	private static final int PADDING = 12;
	private final Navigatgor _navigator;
	
	/**
	 * @param navigator
	 */
	public Tip(Navigatgor navigator)
	{
		_navigator = navigator;
	}
	
	/**
	 * 
	 * @return
	 */
	public Widget create(TipData data)
	{
		DockLayoutPanel dockLayoutPanel = new DockLayoutPanel(Unit.EM);
		dockLayoutPanel.getElement().getStyle().setBackgroundColor("White");
		dockLayoutPanel.getElement().getStyle().setPaddingTop(24, Unit.PX);
		
		Util.centerWidget(dockLayoutPanel);
		
		
		/*
		 * Create Header
		 */
		VerticalPanel headerPanel = new VerticalPanel();
		headerPanel.setHorizontalAlignment(HasHorizontalAlignment.ALIGN_CENTER);
		headerPanel.getElement().getStyle().setBackgroundColor("Orange");
		headerPanel.setWidth("100%");
		
		String backgroundColour = Util.RGBToHex(60, 60, 60);
		Label invisiblePaddingLabel = new Label("^  ^");
		Util.setFontColour(invisiblePaddingLabel, backgroundColour);
		Util.setBackground(invisiblePaddingLabel, backgroundColour);
		headerPanel.add(invisiblePaddingLabel);
		
		Label titleLabel = new Label("Tip of the day");
		Util.centerWidget(titleLabel);
		titleLabel.setWidth("100%");
		
		titleLabel.getElement().getStyle().setColor("White");
		titleLabel.getElement().getStyle().setFontSize(24, Unit.PT);
		headerPanel.add(titleLabel);
		
		String title = data.getTitle();
		Label headerLabel = new Label(title);
		headerLabel.getElement().getStyle().setFontSize(15, Unit.PT);
		headerPanel.setCellHorizontalAlignment(headerLabel, HasHorizontalAlignment.ALIGN_CENTER);
		headerLabel.setWidth("100%");
		headerPanel.add(headerLabel);
		
		dockLayoutPanel.addNorth(headerPanel, 6);
		
		/*
		 * Create description
		 */
		String description = data.getDescription();
		HTML descriptionLabel = new HTML(description);
		descriptionLabel.getElement().getStyle().setPaddingRight(PADDING, Unit.PX);
		
		/*
		 * Manage widget size, depending on screen size.
		 */
		CellPanel cellPanel = null;
		SCREEN_WIDTHS width = System.getScreenWidth();
		if (width == SCREEN_WIDTHS.STANDARD_WIDTH)
		{
			descriptionLabel.setWidth(DESCRIPTION_LABEL_WIDTH + "px");
			dockLayoutPanel.setSize(TIP_WIDTH + "px", TIP_HEIGHT + "px");
			cellPanel = new HorizontalPanel();
		}
		else // Handle small screen witdths
		{
			/*
			 * Use all available space on a Phone.
			 */
			descriptionLabel.setWidth(Window.getClientWidth() + "px");
			dockLayoutPanel.setSize("100%","100%"); 
			cellPanel = new VerticalPanel();
		}
		
		cellPanel.add(descriptionLabel);
		
		/*
		 * Create Image
		 */
		String imageName = data.getImageURI();
		Image image = new Image("images/TipOfTheDay/" + imageName);
		this.scaleAndPadImage(image, width);
		Widget wrappedImage = Util.createCenteredWrappedWidget(image);
		cellPanel.add(wrappedImage);
		
		/*
		 * Button
		 */
		PushButton keyboardShortCutsButton = new PushButton("Continue...");
		keyboardShortCutsButton.setStyleName("continueButton");
		keyboardShortCutsButton.addClickHandler(new ClickHandler() {
			
			@Override
			public void onClick(ClickEvent event) {
				_navigator.open(PAGE.SHORTCUTS);
			}
		});
		
		keyboardShortCutsButton.addTouchStartHandler(new TouchStartHandler() {
			
			@Override
			public void onTouchStart(TouchStartEvent event) {
				_navigator.open(PAGE.SHORTCUTS);
			}
		});
		
		Util.centerWidget(keyboardShortCutsButton);
		dockLayoutPanel.addSouth(keyboardShortCutsButton, 6);
		
		Widget wrappedCenterWidget = Util.createCenteredWrappedWidget(cellPanel);
		dockLayoutPanel.add(wrappedCenterWidget);
		
		
		return dockLayoutPanel;
	}
	
	/**
	 * 
	 * @param image
	 */
	private void scaleAndPadImage(Image image, SCREEN_WIDTHS width)
	{
		int padding = PADDING;
		if (width == SCREEN_WIDTHS.SMALL_WIDTH)
		{
			Util.scaleImage(image, 300, 300);
			padding = 0;
		}	
		
		image.getElement().getStyle().setPaddingTop(padding, Unit.PX);
		image.getElement().getStyle().setPaddingBottom(padding, Unit.PX);
	}
}
